<template>
  <div class="user-account">
    <Cell title="设置登录密码" :border="false" is-link />
    <Cell title="更改手机号" :border="false" is-link />
    <Cell title="密码支付" :border="false" >
      <template #right-icon>
        <VanSwitch active-color="#27ba9b"  v-model="checked" size="18" />
      </template>
    </Cell>
    <Cell title="退出登录" :border="false" is-link @click="logout" />
  </div>
</template>

<script>
import { Cell, Switch as VanSwitch, Dialog } from 'vant'

export default {
  name: 'UserHome',
  components: { Cell, VanSwitch },
  data () {
    return {
      checked: false
    }
  },
  methods: {
    logout () {
      Dialog.confirm({
        title: '温馨提示',
        message: '您确认退出登录吗？'
      }).then(() => {
        // on confirm
        window.FlutterUserLogout && window.FlutterUserLogout.postMessage('退出登录')
      }).catch(() => {
        // on cancel
      })
    }
  }
}
</script>

<style scoped lang='less'>
.van-cell {
  margin-bottom: 10px;
  border-radius: 4px;
}
</style>
